import { nanoid } from "nanoid";
import { readonly } from "vue";

/**
 *  侧面面板栏配置项说明
 *
 *  type  类别
 *  name 右侧属性配置栏表头名
 *  dateFormat 日期格式
 *  icon  阿里云图标字体名称
 *  appendSlot  输入组件是否有末尾插槽
 *  appendSlotContent  末尾插槽文本
 *  label  标签名
 *  label1  日期区间标签名
 *  label2  日期区间标签名
 *  label3  日期区间标签名
 *  placeholder 占位文本
 *  label3Placeholder 日期区间时长（小时）占位文本
 *  label3CanEidt 日期区间时长是否允许修改
 *  tip 提示语
 *  defaultValueRequired 是否有默认值

 *  dateValue: { 日期
 *    parentDateValue: null, 父时间
 *    childDateValue: null 子时间
 *  },
 *  childDateValue 子日期值（比如上下午）
 *  dateValue: { 日期区间
 *    beginParentDateValue: "", 开始的父时间
 *    beginChildDateValue: "", 开始的子时间
 *    endParentDateValue: "", 结束的父时间
 *    endChildDateValue: "", 结束的子时间
 *    dateRange: null 开始到结束的时长
 *  }
 *  beginDate 日期区间开始日期
 *  endDate 日期区间结束日期
 *  dateRange 日期区间时长
 *  minValue 最小值
 *  maxValue 最大值
 *  isBold 字体是否加粗
 *  amountFormat: { 金额格式
 *    showCapital 显示大写
 *    showThousand 显示千分分隔符
 *    showDecimals 显示小数位数
 *    decimalsCount 小数位数数量
 *  }
 *  selectOptions: [{ 选择项
 *    label: 'Option1', 选择项标签名
 *    value: 'Option1', 选择项值
 *  }]
 *  multiple 是否多选
 *  rulesConfig: { 表单校验规则
 *    trigger: "change", 触发方式
 *    messageTip: "", 校验提示
 *    rules: [] 校验数组
 *  },
 *  options: { 其他可选的配置项
 *    required: true,
 *    requiredLabel: "必填"
 *    defaultValue  默认值
 *  }
 * 
 * 
 * {
    "id": "1",
    "name": "1",
    "options": {
        "minRows": "11",
        "showWordLimit": "00",
        "maxlength": "---",
        "placeholder": "0000",
        "readonly": "",
        "disabled": "00",
        "required": "",
        "detail": "",
        "rules": ""
    }
}
 */

const config = [
  {
    title: "文本",
    config: [
      {
        type: "single-input",
        name: "单行文本",
        icon: "Edit",
        id: nanoid(),
        options: {
          required: false,
          readonly: false,
          disabled: false,
          requiredLabel: "必填",
          defaultValue: "",
          placeholder: "请输入",
          showWordLimit: false,
          maxlength: undefined,
          prefixIcon: "",
          suffixIcon: "",
          prepend: "",
          append: "",
          clearable: true,
          size: "default",
          trim: true,
          validateEvent: true,
          inputStyle: {},
          autocomplete: "off",
          tabindex: 0,
          formatter: null,
          parser: null,
          rulesConfig: {
            trigger: "blur",
            messageTip: "请输入内容",
            pattern: "",
            min: undefined,
            max: undefined,
            rules: [],
          },
        },
      },
      {
        type: "textarea",
        name: "多行文本",
        icon: "icon-duohangwenben",
        id: nanoid(),
        options: {
          placeholder: "请输入",
          required: false,
          readonly: false,
          disabled: false,
          requiredLabel: "必填",
          defaultValue: "",
          showWordLimit: false,
          maxlength: undefined,
          minRows: 3,
          maxRows: 6,
          autosize: false,
          resize: "vertical",
          nativeSize: 0,
          validateEvent: true,
          inputStyle: {},
          autocomplete: "off",
          tabindex: 0,
          rulesConfig: {
            trigger: "blur",
            messageTip: "请输入内容",
            pattern: "",
            min: undefined,
            max: undefined,
            rules: [],
          },
        },
      },
      {
        type: "explain",
        name: "说明",
        id: nanoid(),
        icon: "icon-danxingwenben",
        options: {
          defaultValue: "说明",
        },
      },
    ],
  },
  {
    title: "数值",
    config: [
      {
        type: "number",
        name: "数字",
        id: nanoid(),
        icon: "icon-shuzi",
        options: {
          required: false,
          readonly: false,
          requiredLabel: "必填",
          defaultValue: "",
          placeholder: "请输入",
          tip: "身份证、银行卡等超过 15 位数的情况，请使用文本控件",
          minValue: null,
          maxValue: null,
          rulesConfig: {
            trigger: "blur",
            messageTip: "请输入数值",
            rules: [],
          },
        },
      },
      {
        type: "amount",
        name: "金额",
        id: nanoid(),
        icon: "icon-chongzhi",
        options: {
          required: false,
          requiredLabel: "必填",
          defaultValue: "",
          readonly: false,
          rulesConfig: {
            trigger: "blur",
            messageTip: "请输入数值",
            rules: [],
          },
          appendSlot: true,
          appendSlotContent: "CNY-人民币元",
          placeholder: "请输入",
          minValue: null,
          maxValue: null,
          amountFormat: {
            showCapital: false,
            showThousand: true,
            showDecimals: true,
            decimalsCount: 2,
          },
        },
      },
    ],
  },
  {
    title: "选项",
    config: [
      {
        type: "single-select",
        name: "单选",
        icon: "icon-xuanzekuanghou",
        id: nanoid(),
        options: {
          required: false,
          requiredLabel: "必填",
          defaultValue: null,
          placeholder: "请选择",
          multiple: false,
          filterable: true,
          allowCreate: false,
          clearable: true,
          collapseTags: false,
          collapseTagsTooltip: false,
          multipleLimit: 0,
          remote: false,
          remoteMethod: null,
          loading: false,
          popperClass: "",
          teleported: true,
          persistent: true,
          automaticDropdown: false,
          fitInputWidth: false,
          suffixIcon: "ArrowDown",
          tagType: "info",
          selectOptions: [
            {
              label: "默认值",
              value: "默认值",
              disabled: false
            },
          ],
          rulesConfig: {
            trigger: "change",
            messageTip: "请至少选择一项",
            rules: [],
          },
        },
      },
      {
        type: "multiple-select",
        name: "多选",
        icon: "icon-duoxuananniu",
        id: nanoid(),
        options: {
          multiple: true,
          required: false,
          requiredLabel: "必填",
          defaultValue: [],
          placeholder: "请选择",
          layout: "垂直布局",
          max: undefined,
          min: undefined,
          textColor: "#000000",
          fill: "#409EFF",
          border: false,
          size: "default",
          buttonStyle: false,
          validateEvent: true,
          showCheckbox: false,
          checkStrictly: false,
          defaultExpandAll: false,
          expandOnClickNode: true,
          checkOnClickNode: false,
          indent: 16,
          icon: "",
          selectOptions: [
            {
              label: "默认值",
              value: "默认值",
              disabled: false,
              border: false
            },
          ],
          rulesConfig: {
            trigger: "change",
            messageTip: "请选择",
            rules: [],
          },
        },
      },
    ],
  },
  {
    title: "日期时间",
    config: [
      {
        type: "date",
        name: "日期选择",
        id: nanoid(),
        icon: "icon-riqi",
        options: {
          required: false,
          requiredLabel: "必填",
          defaultValue: null,
          placeholder: "请选择",
          type: "date",
          format: "YYYY-MM-DD",
          valueFormat: "YYYY-MM-DD",
          disabledDate: null,
          shortcuts: [],
          editable: true,
          clearable: true,
          size: "default",
          unlinkPanels: false,
          startPlaceholder: "开始日期",
          endPlaceholder: "结束日期",
          rulesConfig: {
            trigger: "change",
            messageTip: "请选择日期",
            rules: [],
          },
        },
      },
    ],
  },
  {
    title: "日期",
    config: [
      {
        type: "date",
        name: "日期",
        id: nanoid(),
        icon: "icon-riqi",
        options: {
          dateFormat: "YYYY-MM-DD",
          required: false,
          requiredLabel: "必填",
          placeholder: "请选择",
          dateValue: {
            parentDateValue: "",
            childDateValue: "",
          },
          rulesConfig: {
            trigger: "blur",
            messageTip: "请选择日期",
            rules: [],
          },
        },
      },
      {
        type: "date-range",
        name: "日期区间",
        id: nanoid(),
        icon: "icon-24gl-calendar",
        options: {
          dateFormat: "YYYY-MM-DD",
          required: false,
          requiredLabel: "必填",
          label1: "开始时间",
          label2: "结束时间",
          label3: "时长 (天)",
          placeholder: "请选择",
          label3Placeholder: "自动计算",
          label3CanEidt: true,
          dateValue: {
            beginParentDateValue: "",
            beginChildDateValue: "",
            endParentDateValue: "",
            endChildDateValue: "",
            dateRange: "",
          },
          selectOptions: [
            {
              label: "上午",
              value: "am",
            },
            {
              label: "下午",
              value: "pm",
            },
          ],
          rulesConfig: {
            trigger: "blur",
            messageTip: "请选择时间",
            rules: [],
          },
        },
      },
      {
        type: "time",
        name: "时间",
        id: nanoid(),
        icon: "icon-riqi",
        options: {
          required: false,
          requiredLabel: "必填",
          dateFormat: "hh:mm:ss",
          placeholder: "请选择",
          dateValue: {
            parentDateValue: "",
            childDateValue: "",
          },
          rulesConfig: {
            trigger: "blur",
            messageTip: "请选择日期",
            rules: [],
          },
        },
      },
      {
        type: "time-range",
        name: "时间区间",
        id: nanoid(),
        icon: "icon-riqi",
        options: {
          required: false,
          requiredLabel: "必填",
          dateFormat: "hh:mm:ss",
          placeholder: "请选择",
          dateValue: {
            parentDateValue: "",
            childDateValue: "",
          },
          rulesConfig: {
            trigger: "blur",
            messageTip: "请选择日期",
            rules: [],
          },
        },
      },
    ],
  },
  {
    title: "其他",
    config: [
      {
        type: "upload-picture",
        name: "图片",
        id: nanoid(),
        icon: "icon-tupian",
        options: {
          required: false,
          requiredLabel: "必填",
          defaultValue: [],
          rulesConfig: {
            trigger: "change",
            messageTip: "请上传文件",
            rules: [],
          },
        },
      },
      {
        type: "upload-file",
        name: "附件",
        id: nanoid(),
        icon: "icon-fujian",
        options: {
          required: false,
          requiredLabel: "必填",
          defaultValue: [],
          rulesConfig: {
            trigger: "change",
            messageTip: "请上传文件",
            rules: [],
          },
        },
      },
      {
        type: "section",
        name: "部门",
        id: nanoid(),
        icon: "icon-bumen",
        options: {
          required: false,
          requiredLabel: "必填",
          defaultValue: [],
          radioValue: 0,
          radioOptions: [
            { value: 0, label: "可选一个部门" },
            { value: 1, label: "可选多个部门" },
          ],
          rulesConfig: {
            trigger: "change",
            messageTip: "请选择部门",
            rules: [],
          },
        },
      },
      {
        type: "divider-text",
        name: "分割文本",
        icon: "Menu",
        id: nanoid(),
        options: {
          content: "分割文本",
          contentPosition: "center", // left/right/center
          borderStyle: "solid", // solid/dashed/dotted
          borderColor: "#DCDFE6",
          fontSize: "14px",
          fontWeight: "normal",
          textColor: "#303133"
        }
      },
      {
        type: "alert",
        name: "警告提示",
        icon: "Warning",
        id: nanoid(),
        options: {
          title: "提示内容",
          type: "info", // success/warning/info/error
          description: "",
          closable: true,
          showIcon: true,
          center: false,
          effect: "light" // light/dark
        }
      }
    ],
  },
  {
    title: "页面布局",
    config: [
      {
        type: "desc",
        name: "描述文本",
        id: nanoid(),
        icon: "icon-danxingwenben",
        options: {
          defaultValue: 14, // 字体大小
          minValue: 10,
          maxValue: 30,
          isBold: false,
        },
      },
      {
        type: "divider",
        name: "分割线",
        id: nanoid(),
        icon: "icon-danxingwenben",
        options: {}
      },
      {
        type: "layout",
        name: "分栏",
        id: nanoid(),
        icon: "icon-danxingwenben",
        options: {
          required: false,
          requiredLabel: "必填",
          defaultValue: 14, // 字体大小
          minValue: 10,
          maxValue: 30,
          isBold: false,
        },
        items: [],
      },
      {
        type: "table",
        name: "表格",
        id: nanoid(),
        icon: "icon-danxingwenben",
        options: {
          required: false,
          requiredLabel: "必填",
          defaultValue: 14, // 字体大小
          minValue: 10,
          maxValue: 30,
          isBold: false,
        },
        columns: [],
      },
    ],
  },
  {
    title: "布局组件",
    config: [
      {
        type: "grid",
        name: "栅格布局",
        icon: "Grid",
        id: nanoid(),
        options: {
          gutter: 0,
          justify: "start",
          align: "top",
          colNum: 2,
          columns: [
            {
              span: 12,
              list: []
            },
            {
              span: 12,
              list: []
            }
          ]
        }
      },
      {
        type: "container",
        name: "容器",
        icon: "Box",
        id: nanoid(),
        options: {
          title: "容器标题",
          showHeader: true,
          shadow: "never",
          padding: "20px",
          background: "#ffffff",
          list: []  // 用于存放拖入的组件
        }
      },
      {
        type: "tabs",
        name: "标签页",
        icon: "Menu",
        id: nanoid(),
        options: {
          type: "border-card",
          tabPosition: "top",
          activeName: "tab1",
          tabs: [
            {
              label: "标签1",
              name: "tab1",
              list: []
            },
            {
              label: "标签2",
              name: "tab2",
              list: []
            }
          ]
        }
      },
      {
        type: "steps",
        name: "步骤条",
        icon: "Sort",
        id: nanoid(),
        options: {
          direction: 'horizontal',
          active: 0,
          alignCenter: false,
          simple: false,
          steps: [
            {
              title: '步骤1',
              description: '这是步骤1的描述',
              list: []
            },
            {
              title: '步骤2',
              description: '这是步骤2的描述',
              list: []
            }
          ]
        }
      }
    ]
  },
  {
    title: "高级组件",
    config: [
      {
        type: "cascader",
        name: "级联选择",
        icon: "Share",
        id: nanoid(),
        options: {
          required: false,
          placeholder: "请选择",
          multiple: false,
          clearable: true,
          showAllLevels: true,
          collapseTags: false,
          separator: "/",
          options: [
            {
              value: 'option1',
              label: '选项1',
              children: [
                {
                  value: 'option1-1',
                  label: '选项1-1'
                }
              ]
            }
          ],
          rulesConfig: {
            trigger: "change",
            messageTip: "请选择",
            rules: []
          }
        }
      },
      {
        type: "transfer",
        name: "穿梭框",
        icon: "Switch",
        id: nanoid(),
        options: {
          required: false,
          titles: ['列表1', '列表2'],
          filterable: true,
          filterPlaceholder: "请输入搜索内容",
          data: [
            {
              key: 1,
              label: '选项1',
              disabled: false
            },
            {
              key: 2,
              label: '选项2',
              disabled: false
            }
          ],
          rulesConfig: {
            trigger: "change",
            messageTip: "请选择",
            rules: []
          }
        }
      },
      {
        type: "rate",
        name: "评分",
        icon: "Star",
        id: nanoid(),
        options: {
          required: false,
          max: 5,
          allowHalf: false,
          showScore: false,
          showText: false,
          texts: ['极差', '失望', '一般', '满意', '惊喜'],
          rulesConfig: {
            trigger: "change",
            messageTip: "请评分",
            rules: []
          }
        }
      },
      {
        type: "slider",
        name: "滑块",
        icon: "Operation",
        id: nanoid(),
        options: {
          required: false,
          min: 0,
          max: 100,
          step: 1,
          showInput: false,
          range: false,
          marks: {
            0: '0',
            50: '50',
            100: '100'
          },
          rulesConfig: {
            trigger: "change",
            messageTip: "请选择",
            rules: []
          }
        }
      },
      {
        type: "color-picker",
        name: "颜色选择器",
        icon: "Brush",
        id: nanoid(),
        options: {
          required: false,
          showAlpha: false,
          colorFormat: 'hex',
          predefine: [
            '#ff4500',
            '#ff8c00',
            '#ffd700',
            '#90ee90',
            '#00ced1',
            '#1e90ff',
            '#c71585'
          ],
          rulesConfig: {
            trigger: "change",
            messageTip: "请选择颜色",
            rules: []
          }
        }
      }
    ]
  },
  {
    title: "高级表单",
    config: [
      {
        type: "dynamic-form",
        name: "动态表单",
        icon: "List",
        id: nanoid(),
        options: {
          required: false,
          title: "动态表单",
          showHeader: true,
          min: 1,
          max: 5,
          addButtonText: "添加",
          deleteButtonText: "删除",
          showIndex: true,
          indexLabel: "序号",
          columns: [
            {
              type: "single-input",
              label: "字段1",
              prop: "field1",
              placeholder: "请输入",
              width: "200px",
              rules: []
            },
            {
              type: "single-select",
              label: "字段2",
              prop: "field2",
              placeholder: "请选择",
              width: "200px",
              options: [
                { label: "选项1", value: "1" },
                { label: "选项2", value: "2" }
              ],
              rules: []
            }
          ],
          defaultValue: [],
          rulesConfig: {
            trigger: "change",
            messageTip: "请完善表单",
            rules: []
          }
        }
      },
      {
        type: "upload",
        name: "文件上传",
        icon: "Upload",
        id: nanoid(),
        options: {
          required: false,
          action: "",
          multiple: true,
          limit: 5,
          fileSize: 10, // MB
          fileTypes: [".jpg", ".png", ".pdf", ".doc", ".docx"],
          drag: true,
          buttonText: "点击上传",
          tipText: "支持拖拽上传",
          listType: "text", // text/picture/picture-card
          autoUpload: true,
          showFileList: true,
          rulesConfig: {
            trigger: "change",
            messageTip: "请上传文件",
            rules: []
          }
        }
      },
      {
        type: "rich-text",
        name: "富文本编辑器",
        icon: "Edit",
        id: nanoid(),
        options: {
          required: false,
          height: "300px",
          placeholder: "请输入内容",
          defaultValue: "",
          toolbarKeys: [
            "bold",
            "italic",
            "underline",
            "through",
            "color",
            "bgColor",
            "clearStyle",
            "indent",
            "fontSize",
            "fontFamily",
            "justifyLeft",
            "justifyRight",
            "justifyCenter",
            "justifyJustify",
            "lineHeight",
            "insertImage",
            "insertTable",
            "insertLink",
            "code",
            "undo",
            "redo"
          ],
          rulesConfig: {
            trigger: "change",
            messageTip: "请输入内容",
            rules: []
          }
        }
      },
      {
        type: "signature",
        name: "手写签名",
        icon: "Edit",
        id: nanoid(),
        options: {
          required: false,
          width: 300,
          height: 150,
          penColor: "#000000",
          backgroundColor: "#ffffff",
          clearButtonText: "清除",
          saveButtonText: "保存",
          rulesConfig: {
            trigger: "change",
            messageTip: "请签名",
            rules: []
          }
        }
      }
    ]
  }
];

export default config;
